Vue.component("chat_panel_comp", {
	props : [ 'account','msg_box_list','contacts','recents'],
	data : function() {

		return {
			title : "aaa",
			member_show : false,
			fri_accounts : [],
			memeber_num:0,
			group_id : null,
			chat_type:null,

		};
	},
	watch:{
		msg_box_list:function(){
			for(var i=0;i<this.msg_box_list.length;i++){
				if(this.msg_box_list[i].type=="text"){
					Vue.set(this.msg_box_list[i],"comp_type","textmsg_comp");
				}
				if(this.msg_box_list[i].type=="img"){
					Vue.set(this.msg_box_list[i],"comp_type","img_msg_comp");
				}
				if(this.msg_box_list[i].type=="file"){
					Vue.set(this.msg_box_list[i],"comp_type","file_msg_comp");
				}
				if(this.msg_box_list[i].account==this.account){
					this.msg_box_list[i]["position"]="right";
				}else{
					this.msg_box_list[i]["position"]="left";
				}
				this.msg_box_list[i]["head_icon"]="get_icon?account="
												+ this.msg_box_list[i].account + "&code="
												+ 100 * Math.random()
			}
			
			console.log("列表变动"+$($(".msg_list_panel")[0]).height());
			//消息列表变化时自动将滚动条滚动到底部
			$(".msg_list_panel").scrollTop($(".msg_list_panel")[0].scrollHeight);
		}
	},
	template : loadHTML("components/chat_panel/chat_panel.html"),
	ready : function() {
		console.log("chat_panel-->ready");
		$(".emotion_panel").qqFace({

			assign : 'txtarea',
			path : 'images/arclist/' // 表情存放的路径
		});
		
		$(".msg_list_panel").scrollTop($(".msg_list_panel")[0].scrollHeight);
	},
	methods : {
		update_remebers:function(group_id){
			//根据群组id获取群成员
			this.fri_accounts=[];
			
			sendRequest("getRemebers", "post", "json", false, {"group_id":group_id}, function(res){
				console.log(res);
				for(var i=0;i<res.data.length;i++){
					this.fri_accounts.push({
						fri_account:res.data[i].account,
						headicon_src:"get_icon?account="+res.data[i].account+"&code="+100*Math.random(),
						username:res.data[i].username,
						city:res.data[i].city
					});
				}
				this.memeber_num=res.data.length;
				
			}.bind(this));
			
		},
		init : function(data) {
			//初始化聊天窗口数据
			console.log(data);
			$("#txtarea").val("");
			this.fri_accounts=[];
			this.title = data.title;
			this.chat_type=data.chat_type;
			if(data.chat_type=="single"){
				console.log("打开单聊窗口");
				this.fri_accounts.push({
					fri_account : data.friaccount,
					headicon_src : "get_icon?account="+data.friaccount+"&code="+100*Math.random(),
					username : data.username,
					city : data.position
				});
			}
			if(data.chat_type=="group"){
				this.group_id=data.friaccount;
				this.update_remebers(data.friaccount);
				this.title=data.title;
				
			}
			
		
			

			// 通知父组件已打开聊天窗
			var opts = {
				type:null,
				chat_tip : null,
				fri_accounts : this.fri_accounts,
				username:null
			};
			if (this.group_id == null) {
				opts.type="single";
				opts.chat_tip = this.fri_accounts[0].fri_account;
				opts.username=this.fri_accounts[0].username;

			} else { 
				opts.type="group";
				opts.chat_tip = this.group_id;
				opts.username=this.title;
				
			}
			this.$emit("open_chat_panel", opts);
			
			
			
			//初始化当前聊天对象消息盒子
			
			this.$emit("get_msg_box",data.friaccount);
			this.$emit("get_contact");
			this.$emit("get_recents");
			
			
			
			
		},
		emotion_click : function() {
			// console.log(document.getElementById("facebox"));

		},
		big_img_comp : function(data) {
			console.log(this);
			this.$emit("big_img_comp", data);
		},
		send_msg : function() {
			var msg = $("#txtarea").val();
			var reqtype = "single";
			var members = "";
			if (this.chat_type == "single") {
				reqtype = "singlechat"
				members = this.fri_accounts[0].fri_account.toString();
				

			}
			if (this.chat_type == "group") {
				reqtype = "groupchat"
				for (var i = 0; i < this.fri_accounts.length; i++) {
					members = this.group_id.toString();
				}
			}

			var msg_data = getDateStructure(this.account, members, "json",
					reqtype, msg);
			sendmsg(JSON.stringify(msg_data));
		},
		show_members : function() {
			if (this.member_show) {
				$(".members_panel").css("display", "none");
				this.member_show = false;
				return;
			}
			// var height=0;
			//
			// var timmer=setInterval(function(){
			// $(".members_panel").css("height",height+=5);
			// if(height>=100){
			// $(".members_panel").css("display","flex");
			// clearInterval(timmer);
			// return;
			// }
			// }, 50)
			$(".members_panel").css("display", "flex");
			this.member_show = true;
		},
		open_add_panel : function() {
			console.log("打开添加成员面板");
		
			this.$emit("open_select_panel","add_remebers");

		},
		get_chat_obj:function(){
			return JSON.parse(JSON.stringify(this.fri_accounts));
		},
		update_group_remrbers:function(){
			//更新群成员
			
			
		},
		upload_file:function(){
			var data={
					action:"send_file",
					chat_type:this.chat_type,
					
					friAccount:null,
			};
			if(this.chat_type=="group"){
				data.friAccount=this.group_id;
			}else{
				data.friAccount=this.fri_accounts[0].fri_account;
			}
			
			
			this.$emit("upload_file",data);
		}
		
	}
});